import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import './assets/css/reset.css'
Vue.use(ElementUI)
Vue.config.productionTip = false

import { routerGo, genActiveRule } from './utils/routerTo'

// 导入乾坤函数
import {
    registerMicroApps,
    runAfterFirstMounted,
    // setDefaultMountApp,
    start
} from "qiankun";

/**
   * @description 启动主应用
   * @param prefetch 是否在第一次安装子应用程序后预取子应用程序的资产,默认为 true
   * @param jsSandbox 是否启用沙盒，当沙盒启用时，我们可以保证子应用程序是相互隔离的,默认为 true
   * @param singular 是否在一个运行时只显示一个子应用程序，这意味着子应用程序将等待挂载，直到卸载之前,默认为 true
   * @param fetch 设置一个fetch function,默认为 window.fetch
   */

const startOptions = {
    prefetch: false,
    singular: false
}

let app = null
let childArr = []
function render({ appContent, loading }) {
    console.log('正在加载')
    console.log(appContent == true)
    if (startOptions.singular || !appContent) {
        childArr = []
    }
    console.log('%c'+childArr,'color:green;')
    if (appContent) {
        console.log('%c' + this.name, 'color:red;')
        let isChild = childArr.some(item => {
            return item.name == this.name
        })
        if (!isChild) {
            childArr.push({
                name: this.name,
                content: appContent,
                loading: loading
            })
        }
    }
    if (!app) {
        console.log('初始化主应用render')
        app = new Vue({
            el: '#app',
            router,
            store,
            data() {
                return {
                    childArr: childArr
                }
            },
            render(h) {
                return h(App, {
                    props: {
                        childArr: this.childArr
                    }
                })
            }
        })
    } else {
        app.childArr = childArr
    }
}


// 初始化主应用
render({ loading: true })

let msg = {
    data: store.state,
    fns: [
        routerGo,
        function changeDataMsg(val) {
            store.dispatch('sendData', val)
        }
    ]
};

// 注册子应用
registerMicroApps(
    [
        {
            name: 'app1',
            entry: '//localhost:2001',
            render: render.bind({ name: 'app1' }),
            activeRule: genActiveRule('/app1'),
            props: msg
        },
        {
            name: 'app2',
            entry: '//localhost:2002',
            render: render.bind({ name: 'app2' }),
            activeRule: genActiveRule('/app1'),
            props: msg
        },
        {
            name: 'app3',
            entry: '//localhost:1020',
            render: render.bind({ name: 'app3' }),
            activeRule: genActiveRule('/layout/app3'),
            props: msg
        },
        {
            name: 'app4',
            entry: '//localhost:1021',
            render: render.bind({ name: 'app4' }),
            activeRule: genActiveRule('/layout/app4'),
            props: msg
        }
    ]
)
/**
   * @description 设置哪个子应用程序在主加载后默认处于活动状态
   * @param defaultAppLink: string 跳转链接
   */
// setDefaultMountApp('/app1')

/**
   * @description 第一个应用构建完成后执行
   * @param 要执行的函数
   */
runAfterFirstMounted(() => console.info('first app mounted'))

start(startOptions)
